<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:a4j="http://richfaces.org/a4j" template="/pages/templates/template.xhtml">
<ui:debug hotkey="0" />
<ui:define	name="body">
	<h:form>
		<f:view>
			<f:metadata>
	            <f:viewAction action="#{personController.loadPersonModelList()}"/>
	        </f:metadata>
        </f:view>
		<h:inputHidden id="id" value="${personController.id}" ></h:inputHidden>
		<rich:panel title="Add Person Form" rendered="true">
			<h:outputLabel value="First Name" for="firstName" ><h:inputText id="firstName" value="${personController.firstName}"></h:inputText></h:outputLabel>
			<br />
			<h:outputLabel  value="Last Name" for="lastName"><h:inputText id="lastName" value="${personController.lastName}"></h:inputText></h:outputLabel>
			<br />
			<h:outputLabel value="Date Birth" for="dateBirth">
				<h:inputText id="dateBirth" value="${personController.dateBirth}" >
			 		<f:convertDateTime pattern="dd/MM/yyyy" />
			 	</h:inputText></h:outputLabel>
			<br />
			<a4j:commandButton action="${personController.addPerson}" execute="@form" value="Add Person" type="button"></a4j:commandButton>
		</rich:panel>
	</h:form>
		<rich:panel>
		 			<rich:dataTable value="#{personController.personModelList}"  var="person" id="personDataTable" rows="20" rowClasses="odd-row, even-row"
		            		styleClass="stable">
		            		<rich:column>
				                <f:facet name="header">
				                    <h:outputText value="First Name" />
				                </f:facet>
				                <h:outputText value="#{person.firstName}" />
				            </rich:column>
				            <rich:column>
				                <f:facet name="header">
				                    <h:outputText value="Last Name" />
				                </f:facet>
				                <h:outputText value="#{person.lastName}" />
				            </rich:column>
				            <rich:column>
				                <f:facet name="header">
				                    <h:outputText value="Date Birth" />
				                </f:facet>
				                <h:outputText value="#{person.dateBirth}" />
				            </rich:column>
		            </rich:dataTable>
		</rich:panel>
</ui:define>
</ui:composition>
